<template>
    <div class="spotZan">
        <div class="dz_box" v-for="x in list">
            <div class="dz_uhead"><img :src="x.uhead" alt=""></div>
            <div class="dz_box_r">
              <p class="dz_nickName"><span>{{x.nickName}}</span><span>{{x.time}}</span></p>
              <p class="dz_tb"><img src="../../../../static/img/tz1.png" alt=""><span>赞了你的作品</span></p>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "spotZan",
        data(){
          return {
            list:[{uhead:'../../../../static/img/uhead.jpg',nickName:'心愿',time:'02-01'},{uhead:'../../../../static/img/uhead.jpg',nickName:'心愿',time:'02-01'},{uhead:'../../../../static/img/uhead.jpg',nickName:'心愿',time:'02-01'},{uhead:'../../../../static/img/uhead.jpg',nickName:'心愿',time:'02-01'},{uhead:'../../../../static/img/uhead.jpg',nickName:'心愿',time:'02-01'},{uhead:'../../../../static/img/uhead.jpg',nickName:'心愿',time:'02-01'}]
          }
        }
    }
</script>

<style scoped>

  .dz_box {
    padding: .1rem 0;
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    border-bottom: .01rem solid #F5F5F5;
  }
  .dz_box_r {
    width: calc(100% - .5rem);
    height: .4rem;
    display: flex;
    flex-flow: column;
    justify-content: space-between;
  }
  .dz_uhead {
    width: .4rem;
    height: .4rem;
    margin-right: .1rem;
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: center;
  }
  .dz_uhead>img {
    width: .32rem;
    height: .32rem;
  }
  .dz_nickName {
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-between;
  }
  .dz_nickName>span:nth-child(1) {
    font-size:.15rem;
    font-family:PingFang SC;
    font-weight:400;
    color: #333333;
  }
  .dz_nickName>span:nth-child(2) {
    font-size:.11rem;
    font-family:PingFang SC;
    font-weight:400;
    color: #999999;
  }
  .dz_tb {
    display: flex;
    flex-flow: row;
    align-items: center;
  }
  .dz_tb>img {
    width: .13rem;
    height: .12rem;
    margin-right: .05rem;
  }
  .dz_tb>span {
    font-size:.11rem;
    font-family:PingFang SC;
    font-weight:400;
    color: #999999;
  }
</style>
